<template>
  <!--上拉加载，异步请求数据的表格列表-->
  <div class="fix_data_list data_list" :class="className">
    <div class="fix_header_wrap" ref="fixHeaderWrap">
      <div class="fixed">
        <slot name="header"></slot>
      </div>
    </div>
    <div class="list_body_wrap" ref="listBodyWrap">
        <BScroll v-show="dataList.length" :data="dataList" :pullup="true" v-on:pullup="pullup" :totalPage="totalPage" :refreshTime="refreshTime">
          <slot name="scrollList" :scrollList="dataList">
            <div class="li_item_content v-1px-b" v-for="(item,index) in dataList" :key="index">
              <slot name="listItem" :productInfo="item"></slot>
            </div>
          </slot>
        </BScroll>
    </div>
  </div>
</template>

<script>
import BScroll from './BScroll';

export default {
  name: 'DynamicTableList',
  components: {
    BScroll
  },
  props: {
    className: String,
    dataList: {
      type: Array,
      default() {
        return [];
      }
    },
    totalPage: {
      type: Number,
      default() {
        return 9999;
      }
    },
    // 设置滚动容器高度
    wrapHeight: [String, Number]
  },
  data() {
    return {
      refreshTime: 0,
    };
  },
  watch: {
    wrapHeight(val) {
      this.$refs.listBodyWrap.style.height = `${this.wrapHeight - this.$refs.fixHeaderWrap.clientHeight}px`;
      console.log('this.$refs.listBodyWrap.style.height', this.$refs.listBodyWrap.style.height);
    }
  },
  mounted() {

  },
  methods: {
    pullup() {
      this.$emit('pullup');
    }
  }
};
</script>

<style lang="less" scoped>
.fix_data_list{
  &.announcement_list{
    .fix_header_wrap{
      display: none;
    }
  }
}
</style>